<template>
  <div>
    <el-table :data="dataList" border>
      <el-table-column prop="name" label="育婴师姓名" width="180"></el-table-column>
      <el-table-column prop="phone" label="育婴师电话" width="180"></el-table-column>
      <el-table-column prop="gender" label="育婴师性别" width="100">
        <template #default="scope">
          <span>{{ scope.row.gender ? '男' : '女' }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="availableFrom" label="预约开始时间" width="200"></el-table-column>
      <el-table-column prop="availableUntil" label="预约结束时间" width="200"></el-table-column>
      <el-table-column prop="createTime" label="预约单创建时间" width="200"></el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      dataList: [],
    };
  },
  created() {
    this.fetchMyReservations();
  },
  methods: {
    fetchMyReservations() {
      this.$axios.get('/api/reservation/item/listFromCurrentUser', {
        params: {
          userId: this.$store.getters.getUser.user_id
        }
      })
      .then(res => {
        if (res.data.code === '001') {
          this.dataList = res.data.data;
        } else {
          this.$notify.error({
            title: '错误',
            message: res.data.msg
          });
        }
      })
      .catch(() => {
        this.$notify.error({
          title: '错误',
          message: '请求失败'
        });
      });
    }
  }
};
</script>
